import { history } from "umi";
import submission from "@/assets/image/Property 1=submission.png";
import CustomResult from "@/components/customResult";
import { CustomTitle } from "@/components/customTitle";
import { PaddingContent } from "@/components/page-padding";
import Calendar from "@/assets/image/icons/calendar.svg";
import "./index.less";

const Successfully = () => {
  const onClick = () => {
    history.push("/mybooking-records");
  };
  return (
    <PaddingContent className="register-month-container">
      <div className="title">
        <CustomTitle>Register Monthly Ballot</CustomTitle>
        <div className="register-Month">
          <span>October 2024</span>
          <img src={Calendar} alt="svg"></img>
        </div>
      </div>
      <CustomResult
        icon={submission}
        resultTitle="Booking Submitted"
        resultSubTitle={`Your booking record has been successfully submitted, and you are now entered into our lucky draw! The
         results will be announced via email. Stay tuned and good luck!`}
        btnText="Back to My Booking Record"
        onClick={onClick}
      />
    </PaddingContent>
  );
};

export default Successfully;
